<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>惠农网 - 首页</title>
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css" />
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/css/my.css" />
</head>
<body>
    <div class="container">
        <%@include file="common/header.jsp"%>
        <div class="row upDown">
            <%--左侧--%>
            <div class="col-2">
                <%@include file="common/product-class.jsp"%>

                <%@include file="common/last-view.jsp"%>
            </div>
            <%--中部--%>
            <div class="col-7">
                <%--展示商品列表--%>
                <div class="row">
                    <c:forEach items="${productList}" var="product">
                        <div class="col-6">
                            <div class="card upDown">
                                <img class="card-img-top pic-height" src="${pageContext.request.contextPath}/images/product/${product.epFileName}" alt="Card image cap">
                                <div class="card-body omit">
                                    <h6 class="card-title">${product.epName}</h6>
                                    <p class="card-text">￥${product.epPrice}</p>
                                    <a href="${pageContext.request.contextPath}/f-product/detail?epId=${product.epId}" class="btn btn-sm btn-primary">查看详情</a>
                                </div>
                            </div>
                        </div>
                    </c:forEach>
                </div>
                <%--分页--%>
                <div class="row float-right">
                    <nav aria-label="Page navigation example" class="float-right">
                        <ul class="pagination">
                            <li class="page-item">
                                <a class="page-link" href="${pageContext.request.contextPath}/f-index/index?page=${currPage>1?currPage-1:1}" aria-label="Previous">
                                    <span aria-hidden="true">&laquo;</span>
                                    <span class="sr-only">Previous</span>
                                </a>
                            </li>
                            <c:forEach var="i" begin="${currPage>3?currPage-3:1}" end="${(totalPage-currPage)>3?currPage+3:totalPage}" step="1">
                                <li <c:if test="${i==currPage}"> class="page-item active" </c:if> <c:if test="${i!=currPage}"> class="page-item" </c:if>>
                                    <a class="page-link" href="${pageContext.request.contextPath}/f-index/index?page=${i}">${i}</a>
                                </li>
                            </c:forEach>
                            <li class="page-item">
                                <a class="page-link" href="${pageContext.request.contextPath}/f-index/index?page=${currPage<totalPage?currPage+1:totalPage}" aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                    <span class="sr-only">Next</span>
                                </a>
                            </li>
                            <li style="line-height: 38px" class="align-middle">共${totalPage}页</li>
                        </ul>
                    </nav>
                </div>
            </div>
            <%--右侧--%>
            <div class="col-3">
                <%@include file="common/news-list.jsp"%>
            </div>
        </div>
        <div class="row text-center">
            <%@include file="common/footer.jsp"%>
        </div>
    </div>
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script type="text/javascript" src="${pageContext.request.contextPath}/scripts/jquery-3.5.1.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/scripts/popper.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/scripts/bootstrap.min.js"></script>
</body>
</html>